<html>

<head>
    <meta name="description" content="Alger的博客,这里有好多新奇的知识,以及一个小开发者的闲话">
    <meta name="keywords"
        content="Alger,Alger的博客,Alger's blog,alger,alger的博客,html,css,vue,刘俊杰的博客,刘俊杰,liujunjie,Alger开发,Android,刘先生">

    <meta charset="utf-8" />
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1" />

<title>Alger&#39;s blog</title>

<link rel="shortcut icon" href="http://www.myalger.ml/favicon.ico?v=1602725656399">

<link href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet">
<link rel="stylesheet" href="http://www.myalger.ml/styles/main.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.0/dist/css/bootstrap.min.css">

<script src="https://cdn.jsdelivr.net/npm/@highlightjs/cdn-assets/highlight.min.js"></script>
<script src="https://cdn.bootcss.com/highlight.js/9.15.10/languages/dockerfile.min.js"></script>
<script src="https://cdn.bootcss.com/highlight.js/9.15.10/languages/dart.min.js"></script>

<script src="https://cdn.jsdelivr.net/npm/moment@2.27.0/moment.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.0/dist/js/bootstrap.min.js"></script>
<!-- DEMO JS -->
<!--<script src="media/scripts/index.js"></script>-->


</head>

<body>
    <div class="main gt-bg-theme-color-first">
        <div class="main-content">
            <nav class="navbar navbar-expand-lg">
    <div class="navbar-brand">
        <img class="user-avatar" src="/images/avatar.png" alt="头像">
        <div class="site-name gt-c-content-color-first">
            Alger&#39;s blog
        </div>
    </div>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
            aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <i class="fas fa-bars gt-c-content-color-first" style="font-size: 18px"></i>
    </button>
    <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <div class="navbar-nav mr-auto" style="text-align: center">
            
                <div class="nav-item">
                    
                        <a href="/" class="menu gt-a-link">
                            首页
                        </a>
                    
                </div>
            
                <div class="nav-item">
                    
                        <a href="/archives" class="menu gt-a-link">
                            归档
                        </a>
                    
                </div>
            
                <div class="nav-item">
                    
                        <a href="/tags" class="menu gt-a-link">
                            标签
                        </a>
                    
                </div>
            
                <div class="nav-item">
                    
                        <a href="http://www.myalger.ml/about" class="menu gt-a-link">
                            关于
                        </a>
                    
                </div>
            
        </div>
        <div style="text-align: center">
            <form id="gridea-search-form" style="position: relative" data-update="1602725656399" action="/search/index.html">
                <input class="search-input" autocomplete="off" spellcheck="false" name="q" placeholder="搜索文章" />
                <i class="fas fa-search gt-c-content-color-first" style="position: absolute; top: 9px; left: 10px;"></i>
            </form>
        </div>
    </div>
</nav>


            <div class="post-list-container">
    <div class="post-inner">
        
            <div class="post gt-bg-theme-color-second">
                <div class="post-left">
                    <div>
                        
                            <span class="sticky-top-flag gt-bg-accent-color-first">置顶</span>
                        
                        <a href="http://www.myalger.ml/s_xra075M/">
                            <span class="post-title gt-c-content-color-first">从零开始使用Vue3.0和Vant制作音乐App (一)1️⃣</span>
                        </a>
                    </div>
                    <div class="gt-post-content post-abstract gt-c-content-color-second">
                        <p><img src="https://i0.hdslb.com/bfs/album/b7e980f34f1c98b4e3217a5910a68fabab3be881.jpg" alt="" loading="lazy"><br>
模仿网易云制作音乐APP🎧</p>

                    </div>
                    <div class="post-info">
                        <time class="post-time gt-c-content-color-first">
                            发布于 · 2020-08-28 ·
                        </time>
                        
                            <a href="http://www.myalger.ml/He-D_m5QM/" class="post-tag">
                                # JavaScript
                            </a>
                        
                            <a href="http://www.myalger.ml/p9SDW22Ljl/" class="post-tag">
                                # Vue.js
                            </a>
                        
                            <a href="http://www.myalger.ml/FoJvIOEID/" class="post-tag">
                                # HTML
                            </a>
                        
                            <a href="http://www.myalger.ml/Io18193yza/" class="post-tag">
                                # CSS
                            </a>
                        
                    </div>
                </div>
                
                    <a href="http://www.myalger.ml/s_xra075M/" class="post-feature-image"
                       style="background-image: url('https://i0.hdslb.com/bfs/album/b7e980f34f1c98b4e3217a5910a68fabab3be881.jpg')">
                    </a>
                
            </div>
        
            <div class="post gt-bg-theme-color-second">
                <div class="post-left">
                    <div>
                        
                        <a href="http://www.myalger.ml/M_ZBIBU/">
                            <span class="post-title gt-c-content-color-first">正则表达式学习🏓</span>
                        </a>
                    </div>
                    <div class="gt-post-content post-abstract gt-c-content-color-second">
                        <p>正则表达式使用单个字符串来描述、匹配一系列匹配某个句法规则的字符串。</p>
<p>正则表达式是繁琐的，但它是强大的，学会之后的应用会让你除了提高效率外，会给你带来绝对的成就感。</p>

                    </div>
                    <div class="post-info">
                        <time class="post-time gt-c-content-color-first">
                            发布于 · 2020-03-13 ·
                        </time>
                        
                            <a href="http://www.myalger.ml/G4NR921eB/" class="post-tag">
                                # Share
                            </a>
                        
                    </div>
                </div>
                
                    <a href="http://www.myalger.ml/M_ZBIBU/" class="post-feature-image"
                       style="background-image: url('https://s2.ax1x.com/2020/03/04/3om0zV.jpg')">
                    </a>
                
            </div>
        
            <div class="post gt-bg-theme-color-second">
                <div class="post-left">
                    <div>
                        
                        <a href="http://www.myalger.ml/X_AlNJN/">
                            <span class="post-title gt-c-content-color-first"> ASP.NET用PlaceHolder动态添加组件实现单选题目</span>
                        </a>
                    </div>
                    <div class="gt-post-content post-abstract gt-c-content-color-second">
                        <p>利用<code>PlaceHolder</code>控件实现一个包含单项选择题的测试页面，其中题目信息包含于数组中。</p>

                    </div>
                    <div class="post-info">
                        <time class="post-time gt-c-content-color-first">
                            发布于 · 2020-03-13 ·
                        </time>
                        
                            <a href="http://www.myalger.ml/NQvaoSPkJ/" class="post-tag">
                                # ASP.NET
                            </a>
                        
                    </div>
                </div>
                
                    <a href="http://www.myalger.ml/X_AlNJN/" class="post-feature-image"
                       style="background-image: url('https://s2.ax1x.com/2020/02/29/3yZRo9.png')">
                    </a>
                
            </div>
        
            <div class="post gt-bg-theme-color-second">
                <div class="post-left">
                    <div>
                        
                        <a href="http://www.myalger.ml/MFE_EFMK/">
                            <span class="post-title gt-c-content-color-first">JavaScript基础- 数据类型🔨</span>
                        </a>
                    </div>
                    <div class="gt-post-content post-abstract gt-c-content-color-second">
                        <p>ES5中有六种数据类型<br>
js中的数据类型为字面变量 以它的值来定义数据类型</p>

                    </div>
                    <div class="post-info">
                        <time class="post-time gt-c-content-color-first">
                            发布于 · 2020-03-13 ·
                        </time>
                        
                            <a href="http://www.myalger.ml/He-D_m5QM/" class="post-tag">
                                # JavaScript
                            </a>
                        
                    </div>
                </div>
                
                    <a href="http://www.myalger.ml/MFE_EFMK/" class="post-feature-image"
                       style="background-image: url('https://s2.ax1x.com/2020/02/29/3sIvnJ.jpg')">
                    </a>
                
            </div>
        
            <div class="post gt-bg-theme-color-second">
                <div class="post-left">
                    <div>
                        
                        <a href="http://www.myalger.ml/JAB_FEMKG/">
                            <span class="post-title gt-c-content-color-first">JavaScript----Vue.js基础学习 🚀</span>
                        </a>
                    </div>
                    <div class="gt-post-content post-abstract gt-c-content-color-second">
                        <p>Vue 是一套用于构建用户界面的渐进式框架Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。能够为复杂的单页应用提供驱动。</p>

                    </div>
                    <div class="post-info">
                        <time class="post-time gt-c-content-color-first">
                            发布于 · 2020-03-13 ·
                        </time>
                        
                            <a href="http://www.myalger.ml/He-D_m5QM/" class="post-tag">
                                # JavaScript
                            </a>
                        
                            <a href="http://www.myalger.ml/p9SDW22Ljl/" class="post-tag">
                                # Vue.js
                            </a>
                        
                    </div>
                </div>
                
                    <a href="http://www.myalger.ml/JAB_FEMKG/" class="post-feature-image"
                       style="background-image: url('https://s2.ax1x.com/2020/02/29/3yS0oT.png')">
                    </a>
                
            </div>
        
            <div class="post gt-bg-theme-color-second">
                <div class="post-left">
                    <div>
                        
                        <a href="http://www.myalger.ml/AN_GJEO/">
                            <span class="post-title gt-c-content-color-first"> Android计算器案例🤖</span>
                        </a>
                    </div>
                    <div class="gt-post-content post-abstract gt-c-content-color-second">
                        <p>使用简单的网格布局管理器来实现界面🧨<br>
然后使用java代码来实现计算器的操作🎉</p>

                    </div>
                    <div class="post-info">
                        <time class="post-time gt-c-content-color-first">
                            发布于 · 2020-03-13 ·
                        </time>
                        
                            <a href="http://www.myalger.ml/uXar5IwUu/" class="post-tag">
                                # Android
                            </a>
                        
                    </div>
                </div>
                
                    <a href="http://www.myalger.ml/AN_GJEO/" class="post-feature-image"
                       style="background-image: url('https://s1.ax1x.com/2020/03/13/8u9qLn.jpg')">
                    </a>
                
            </div>
        
            <div class="post gt-bg-theme-color-second">
                <div class="post-left">
                    <div>
                        
                        <a href="http://www.myalger.ml/NEGKE_EGG/">
                            <span class="post-title gt-c-content-color-first">教你用代码写一个实时疫情图😷</span>
                        </a>
                    </div>
                    <div class="gt-post-content post-abstract gt-c-content-color-second">
                        <p>🤧这两天疫情越来越严重，各个大公司都做了<strong>实时疫情图</strong>，这里来教一下大家如何用代码来实现</p>

                    </div>
                    <div class="post-info">
                        <time class="post-time gt-c-content-color-first">
                            发布于 · 2020-03-13 ·
                        </time>
                        
                            <a href="http://www.myalger.ml/G4NR921eB/" class="post-tag">
                                # Share
                            </a>
                        
                    </div>
                </div>
                
                    <a href="http://www.myalger.ml/NEGKE_EGG/" class="post-feature-image"
                       style="background-image: url('https://s2.ax1x.com/2020/02/04/1D0mGR.png')">
                    </a>
                
            </div>
        
            <div class="post gt-bg-theme-color-second">
                <div class="post-left">
                    <div>
                        
                        <a href="http://www.myalger.ml/CSS_EF/">
                            <span class="post-title gt-c-content-color-first">CSS动画制作旋转木马🦄</span>
                        </a>
                    </div>
                    <div class="gt-post-content post-abstract gt-c-content-color-second">
                        <p>主要用到了<code>animation</code>动画  <code>transform</code>  旋转<code>perspective</code>产生透视效果 控制好图片的距离，理解三维模型，可以很简单的做出旋转木马。</p>

                    </div>
                    <div class="post-info">
                        <time class="post-time gt-c-content-color-first">
                            发布于 · 2020-02-14 ·
                        </time>
                        
                            <a href="http://www.myalger.ml/FoJvIOEID/" class="post-tag">
                                # HTML
                            </a>
                        
                            <a href="http://www.myalger.ml/Io18193yza/" class="post-tag">
                                # CSS
                            </a>
                        
                    </div>
                </div>
                
                    <a href="http://www.myalger.ml/CSS_EF/" class="post-feature-image"
                       style="background-image: url('https://s2.ax1x.com/2020/02/29/3y9iCD.png')">
                    </a>
                
            </div>
        
            <div class="post gt-bg-theme-color-second">
                <div class="post-left">
                    <div>
                        
                        <a href="http://www.myalger.ml/HTMW_GE/">
                            <span class="post-title gt-c-content-color-first">HTML+CSS 模仿商品展示 💻</span>
                        </a>
                    </div>
                    <div class="gt-post-content post-abstract gt-c-content-color-second">
                        <p>💁今天我们来实现一个简单的<strong><strong>商品展示</strong></strong>小页面</p>
<p>用到的知识主要是<code>:hover</code>和<code>position</code></p>

                    </div>
                    <div class="post-info">
                        <time class="post-time gt-c-content-color-first">
                            发布于 · 2020-02-13 ·
                        </time>
                        
                            <a href="http://www.myalger.ml/FoJvIOEID/" class="post-tag">
                                # HTML
                            </a>
                        
                            <a href="http://www.myalger.ml/Io18193yza/" class="post-tag">
                                # CSS
                            </a>
                        
                    </div>
                </div>
                
                    <a href="http://www.myalger.ml/HTMW_GE/" class="post-feature-image"
                       style="background-image: url('https://s2.ax1x.com/2020/02/04/1D9VhT.gif')">
                    </a>
                
            </div>
        
    </div>
</div>

            <div class="pagination-container">
    
    
</div>


            <div class="site-footer gt-c-content-color-first">
    <div class="slogan gt-c-content-color-first">春风得意马蹄疾,一日看尽长安花.
</div>
    <div class="social-container">
        
            
        
            
        
            
        
            
        
            
        
            
        
    </div>
    <div class="footer-info">
        Powered by <a href="https://github.com/getgridea/gridea" target="_blank">Gridea</a>
    </div>
    <div>
        Theme by <a href="https://imhanjie.com/" target="_blank">imhanjie</a>, Powered by <a
                href="https://github.com/getgridea/gridea" target="_blank">Gridea | <a href="http://www.myalger.ml/atom.xml" target="_blank">RSS</a></a>
    </div>
</div>

<script>
  hljs.initHighlightingOnLoad()
</script>

        </div>
    </div>
</body>

</html>